<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="UTF-8">
    <title>商家表</title>

    <link th:href="@{../layui/css/layui.css}" rel="stylesheet"/>
    <style>
        .box{
            width:500px;
            height:40px;
            border:2px solid #006EFF;
            margin:auto;
        }
        .input{
            float:left;
            width:400px;/*宽400*/
            height:38px;/*高38（因为文本框内外边框要占用1像素所以总体高度减2，其他盒子同理）*/
            outline:none;
            border:none;/*取消文本框内外边框*/
        }
        .button{
            cursor: pointer;
            float:left;
            width:100px;
            height:40px;
            color:white;
            background-color:#006EFF;/*将按钮背景设置为红色，字体设置为白*/
            border:none;
            outline:none;/*取消边框和外边框将按钮边框去掉*/
        }
    </style>
</head>
<body>
    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
        <legend>商家表</legend>
    </fieldset>



    <div class="box">
        <form>
            <input type="text" class="input" placeholder="请输入商家名称">
            <!--placeholder是文本框中的提示文字-->
            <input type="submit" value="搜索" class="button">
        </form>
    </div>




    <div class="layui-form">
        <table class="layui-table">
            <colgroup>
                <col width="100">
                <col width="200">
                <col width="200">
                <col width="200">
                <col>
            </colgroup>
            <thead>
            <tr>
                <th>shop_id</th>
                <th>shop_name</th>
                <th>shop_tel</th>
                <th>shop_address</th>
            </tr>
            </thead>
            <tbody>
            <tr>
                <td>1</td>
                <td>商家名称</td>
                <td>商家电话</td>
                <td>商家地址</td>
                <td>
                    <a href="/route/toAddRoute"><button type="button" class="layui-btn layui-btn-sm"><i class="layui-icon" ></i></button></a>
                    <a href="/route/toSetRoute"><button type="button" class="layui-btn layui-btn-sm"><i class="layui-icon"></i></button></a>
                    <a href="/route/toDelRoute"><button type="button" class="layui-btn layui-btn-sm"><i class="layui-icon"></i></button></a>
                </td>
            </tr>
            </tbody>
        </table>
    </div>






    <script th:src="@{/layui/layui.js}"></script>
    <script>
        layui.use('carousel', function(){
            var carousel = layui.carousel;
            //建造实例
            carousel.render({
                elem: '#test1'
                ,width: '100%' //设置容器宽度
                ,arrow: 'always' //始终显示箭头
                //,anim: 'updown' //切换动画方式
            });
        });
    </script>
</body>
</html>